<template>
  <div class="home">
    <div>
      {{city}}
    </div>
    <van-button type="danger">危险按钮</van-button>
    <div id="allmap"></div>
    <div class="box">
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'

export default {
  name: 'Home',
  components: {
    HelloWorld
  },
  data () {
    return {
      city:""
    }
  },
  mounted () { // 
  var _this = this;
    var map = new BMap.Map("allmap");    // 创建Map实例
    map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);  // 初始化地图,设置中心点坐标和地图级别
    //添加地图类型控件

    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function(r){
      if(this.getStatus() == BMAP_STATUS_SUCCESS){
        console.log(r)
        _this.city = r.address.city
        // var mk = new BMap.Marker(r.point);
        // map.addOverlay(mk);
        // map.panTo(r.point);
        // alert('您的位置：'+r.point.lng+','+r.point.lat);
      }
      else {
        alert('failed'+this.getStatus());
      }        
    },{enableHighAccuracy: true})
  }
}
</script>
<style lang="scss" scoped>
.box{
  width: 178px;
  height:116px;
  background: red;
}
#allmap{
  width: 100%;
  height: 400px;
}
</style>
